require('../css/page.css');

// 信息修改页
document.ready(function () {


    let pid = '';
    let nikename = document.querySelector('.nikename');  //昵称
    let gender = document.querySelector('.gender');      //性别
    let birthday = document.querySelector('.birthday');  //生日
    let msgDom = document.querySelector('.msg');         //个人简介


    let user = JSON.parse(localStorage.getItem('user'));

    
    // console.log(http);
    http.get('/users/accountinfo?userId=' + user.userId, function (res) {
        console.log(res);
        // 如果后端返回数据存在有值   就把当前input框的值换掉
        if (res.data.nickname) {
            nikename.value = res.data.nickname;
        }
        // 性别
        if (res.data.gender) {
            gender.innerText = res.data.gender;
        }
        // 生日
        if (res.data.birthday) {
            let date = new Date(res.data.birthday);
            // 2 只有年月日
            birthday.innerText = utils.formateDate(date, 2);
        }
        // 省份/城市
        if (res.data.address) {
            let arr = res.data.address.split(',');
            // 第0项省级  第1项市级
            shengDom.innerText = arr[0];
            city.innerText = arr[1];
        }
        // 个人简介
        if (res.data.sign) {
            msgDom.value = res.data.sign;
        }

    })




    // 性别 下拉选择框
    let genderDown = document.querySelector('.gender-down');
    genderDown.addEventListener('click', function () {
        weui.picker([{
            label: '男',
            value: '男'
        }, {
            label: '女',
            value: '女'
        }], {
            onConfirm: function (result) {
                //  点击确认按钮之后 把选择的选项添加到页面上 
                console.log(result);
                gender.innerText = result[0].value;
            },
            title: '请选择性别'
        });
    });




    // 生日下拉 选项框
    let birthdayDown = document.querySelector('.birthday-down');

    birthdayDown.addEventListener('click', function () {
        weui.datePicker({
            start: 1930,
            end: new Date().getFullYear(),
            onConfirm: function (result) {
                //  点击确认按钮之后 把选择的选项添加到页面上 
                let y = result[0].value;
                let m = result[1].value;
                let d = result[2].value;
                // 添0补齐
                m = m < 10 ? '0' + m : m;
                d = d < 10 ? '0' + d : d;
                let str = `${y}-${m}-${d}`;
                // console.log(str);
                birthday.innerText = str;
            },
            title: '您的生日'
        });
    })




    // 省份--------------------------------------------------------------------------
    let shengDown = document.querySelector('.sheng-down');
    let shengDom = document.querySelector('.shengs');     //省份
    shengDown.addEventListener('click', function () {

        http.get('/address/province', function (res) {
            let data = res.data.map(function (item, index) {
                return {
                    label: item.name,
                    value: item.addressId
                }
            })
            console.log(res.data);

            weui.picker(data, {
                onConfirm: function (result) {
                    //  点击确认按钮之后 把选择的选项添加到页面上 
                    console.log(result);
                    shengDom.textContent = result[0].label;
                    pid = result[0].value;
                    // 如果选择了省份，就把市级选项清空(改为请选择)
                    city.innerText = '请选择';
                },
                title: '选择省份'
            });
        })
    })



    // 市级
    let city = document.querySelector('.city');          //城市
    let cityDown = document.querySelector('.city-down');
    cityDown.addEventListener('click', function () {
        // 如果省级没选择
        if (pid === '') {
            utils.createToast(0, '请先选择省份');
        } else {
            http.get('/address/city/' + pid, function (res) {
                // console.log(res.data);
                let data = res.data.map(function (item, index) {
                    return {
                        label: item.name,
                        value: item.addressId
                    }
                })
                // 调用生成列表
                weui.picker(data, {
                    onConfirm: function (result) {
                        //确认按钮点击之后 将选择的数据 给页面的dom 
                        city.innerText = result[0].label;
                    },
                    title: '选择城市'
                })

            })
        }
    })






    // 保存信息按钮
    let btnn = document.querySelector('.btnn');  //提交按钮
    btnn.addEventListener('click', function () {
        console.log(111);

        let data = {
            userId: user.userId,
            nickname: nikename.value
        }
        //如果后端有存值，   就把值innerText赋上
        if (gender.innerText != '请选择') {
            data.gender = gender.innerText;
        }
        if (birthday.innerText != '请选择') {
            data.birthday = birthday.innerText;
        }
        if (shengDom.innerText != '请选择' && city.innerText != '请选择') {
            data.address = [shengDom.innerText, city.innerText];
        }
        if (msgDom.value != '') {
            data.sign = msgDom.value;
        }
        //请求接口post方式
        http.post('/users/userEdit', data, function (res) {
            console.log(res);
            //修改成功提醒用户
            if (res.status === 0) {
                utils.createToast(1, '信息修改成功');
            } else {
                utils.createToast(0, res.msg);
            }
        })


    })








})